import React from 'react'
import ReactDOM from 'react-dom/client'
import './index.css'
import Scroll from './components/Scroll'
import reportWebVitals from './reportWebVitals'

const root = ReactDOM.createRoot(document.getElementById('root'))
root.render(
  <React.StrictMode>
    {/*scroll: x, y, both*/}
    {/*mode: normal, auto*/}
    <Scroll scroll="both" mode="auto">
      <p>化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发</p>
      <p style={{width: '150%'}}>化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发</p>
      <p>化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发</p>
    </Scroll>

    <Scroll scroll="both" mode="normal" style={{width: '300px', height: '150px'}}>
      <p
        style={{width: '300%'}}>化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发化肥会挥发</p>
    </Scroll>
  </React.StrictMode>
)

reportWebVitals()
